<cp-navbar (onClickLeft)="onClickLeft()"></cp-navbar>
<div class="loading" *ngIf="loading"><cp-loading></cp-loading></div>
<div class="container" *ngIf="!loading">
  <div class="gutter"></div>
  <div class="rules">
    <div class="common-label-value">
      <p class="title">活动规则</p>
      <div class="list">
        <div class="item" *ngFor="let item of detail.Description">
          <p class="label4">{{ item.Name }}：</p>
          <pre class="value" [innerHTML]="item.Value"></pre>
        </div>
        <div class="item">
          <p class="label4">活动期限：</p>
          <p class="value">{{ detail.Start }} 至 {{ detail.End }}</p>
        </div>
      </div>
    </div>
  </div>
  <form [formGroup]="applyForm" (ngSubmit)="onSubmit()">
    <div class="form">
      <div class="form-group border-bottom">
        <span class="label">您的称呼</span>
        <input formControlName="name" type="text" class="name" placeholder="请输入您的称呼" />
        <span class="sex" (click)="selectSex(1)" [class.active]="activeSex === 1">先生</span>
        <span class="sex" (click)="selectSex(0)" [class.active]="activeSex === 0">女士</span>
      </div>
      <div class="form-group">
        <span class="label">手机号码</span>
        <input formControlName="tel" type="tel" class="tel" placeholder="请输入您的手机号码" />
      </div>
    </div>

    <div class="oprbar"><button class="btn btn-lg btn-block btn-radius btn-gradient btn-shadow">报名</button></div>
  </form>

  <send-code
    [phone]="applyForm.value['tel']"
    [isShow]="codeIsShow"
    (sendCode)="getPhoneCode($event)"
    (close)="closeCodeModal()"
  ></send-code>
</div>
